<template>
  <div class="EmergencyList">
    <div class="flex location-wrap">
      <span class="white">当前位置：</span>
      <el-breadcrumb separator="/">
        <el-breadcrumb-item :to="{ path: '/EWManagement' }">预警管理</el-breadcrumb-item>
        <el-breadcrumb-item>预警通知单</el-breadcrumb-item>
      </el-breadcrumb>
    </div>
    <div class="box">
      <!-- 列表筛选 -->
      <filterTitle @query="handleSearch" @reset="reset" :form="form" labelWidth="140px" :formData="formData"
        @node-click="deptChoose">
        <!-- <el-form slot="filter" class="form" ref="form" :model="form" inline size="small" label-width="140px">
          <el-form-item :label="item.label + '：'" v-for="(item, index) in formData" :key="index" :prop="item.id">
            <LsdForm :compData="item" :form="form" @node-click="deptChoose(arguments, item)" />
          </el-form-item>
        </el-form> -->
      </filterTitle>
      <!-- 列表表格 -->
      <LsdTable slot="gjxm" @select="handleSelectionChange" :paginationAtrrs="paginationAtrrs"
        @pageChange="handleSizeChange" :compRef="table.compRef" ref="gjxm" :columns="table.columns" :title="table.title"
        :actions="table.actions" :tableData="table.tableData" :tableAttr="table.tableAttr" :isShowPage="table.isShowPage"
        :isSelectFlag="table.isSelectFlag" :isSequenceFlag="table.isSequenceFlag" @onActionClick="onActionClick" />
    </div>
    <!-- 弹窗信息 -->
    <LsdDialog :dialogConfig="dialogConfig" @handleBtn="handleBtn" @close="close">
      <LsdDialogTitle slot="dialog" :titleConfig="titleConfig" :activeNames="activeNames">
        <DialogForm ref="formComponent" slot="slot1" :formConfig="formConfig" @changeEvent="handleChange" />
        <div slot="slot2">
          <LsdTable slot="rwxx" :formLabel="tableList.formLabel" :autoHeight="tableList.autoHeight"
            :paginationAtrrs="paginationAtrrs" :compRef="tableList.compRef" ref="gjxm" :columns="tableList.columns"
            :tableData="tableList.tableData" :tableAttr="tableList.tableAttr"
            :isSequenceFlag="tableList.isSequenceFlag" />
        </div>
        <DialogForm ref="formComponent1" slot="slot3" :formConfig="formConfig1" @handleNodeClick="handleNodeClick" />
        <DialogForm ref="formComponent2" slot="slot4" :formConfig="formConfig2" />
        <DialogForm ref="formComponent3" slot="slot5" :formConfig="formConfig3" />
      </LsdDialogTitle>
    </LsdDialog>
    <!-- 预览 -->
    <LsdDialog :dialogConfig="dialogConfig1" @close="closes" @handleBtnX="handleBtnX" @handleBtnD="tzdPrint">
      <Preview slot="dialog" :id="id" :previewVisible.sync="dialogConfig1.isShow" />
    </LsdDialog>

    <!-- 视频关联弹窗 -->
    <LsdDialog :dialogConfig="bdVideoDialog.dialogConfig" @handleBtn="handleBtn" @close="close1">
      <LsdDialogTitle slot="dialog" :titleConfig="bdVideoDialog.titleConfig" :activeNames="activeNames">
        <DialogForm ref="videoForm" slot="slot1" :formConfig="bdVideoDialog.formConfig" />
        <div slot="slot2">
          <DialogForm ref="videoForm1" :formConfig="bdVideoDialog.formConfig1" />
          <div class="flex videoDiv">
            <div><img src="@/assets/img/video.jpg" alt="" width="100%"></div>
            <div class="device">
              <div class="deviceMain">
                <div class="deviceTitle">视频资源列表</div>
                <div class="deviceSearch">
                  <el-input size="small" v-model="devicePlace" placeholder="" class="right">
                  </el-input>
                </div>
                <div class="videoTree">
                  <el-tree :props="props" :load="loadNode" lazy show-checkbox @check-change="handleCheckChange">
                  </el-tree>
                </div>
              </div>
            </div>
          </div>
          <LsdTable compRef="spmc" :columns="bdVideoDialog.formConfig1.table.columns"
            :tableData="bdVideoDialog.formConfig1.table.tableData" :tableAttr="bdVideoDialog.formConfig1.table.tableAttr"
            :isSequenceFlag="bdVideoDialog.formConfig1.table.isSequenceFlag" />
        </div>
      </LsdDialogTitle>
    </LsdDialog>
  </div>
</template>

<script>
// warningNotificationSubmit
import { listPage, getPersonApi, doDownPdf, getSubclassUntilList, getSubclassUntilLists, getOrgDepartmentList, sameLeveltree, deleteById, getAlreadyIssueJudge, getIssueJudgeData, warningNotificationSave, detailList, warningNotificationUpdById, warningNotificationApprove } from "@/api/EarlyWarningManagement/yjtzd";
import { getDictByGroup } from "@/api/common.js";
// import { getUnitTreeApi } from "@/api/EarlyWarningManagement/yjrb";
import Preview from "./components/Preview.vue";
import { showTime } from "@/lib";
import { flowSubmit } from "@/utils/flow";
import Printer from "@/utils/operationTicketPrint";
// import common from "@/utils/common.js";
export default {
  name: "InformationList",
  components: { Preview },
  data() {
    return {
      id: "",
      type: 0,
      zrbmOption: [],
      DetailList: {},
      multipleSelection: [],
      // 筛选信息
      formData: [
        {
          elType: "input",
          id: "warningNoticeName",
          label: "预警通知单",
          attrs: {
            value: "",
            size: "small",
            clearable: true,
            "collapse-tags": true
          }
        },
        {
          elType: "select",
          id: "dangerCode",
          label: "险情类别",
          dic: "dic_xqlb",
          attrs: {
            value: "",
            size: "small",
            clearable: true,
            filterable: true,
            "collapse-tags": true
          },
          options: []
        },
        {
          elType: "select",
          id: "warningLvCode",
          label: "预警级别",
          dic: "dic_yjjb",
          attrs: {
            value: "",
            clearable: true,
            size: "small",
            filterable: true,
            "collapse-tags": true
          },
          options: []
        },
        {
          elType: "input",
          id: "effectRange",
          label: "影响范围",
          attrs: {
            value: "",
            size: "small",
            clearable: true,
            filterable: true,
            "collapse-tags": true
          }
        },
        {
          elType: "dateTimePicker",
          id: "effectStartTime",
          label: "影响时间",
          attrs: {
            value: "",
            size: "small",
            type: "datetimerange",
            clearable: true,
            "start-placeholder": "开始日期",
            "end-placeholder": "结束日期",
            "value-format": "yyyy-MM-dd HH:mm:ss"
          }
        },
        // {
        //   elType: "select",
        //   id: "infoSource",
        //   label: "发布单位",
        //   dic: "dic_xxly",
        //   attrs: {
        //     value: "",
        //     size: "small",
        //     clearable: true,
        //     filterable: true,
        //     "collapse-tags": true
        //   },
        //   options: []
        // },
        {
          elType: "selectTree",
          id: "infoSource",
          name: "unitId",
          label: "发布单位",
          attrs: {
            value: "",
            clearable: true,
            "collapse-tags": true
          },
          options: {
            attrs: {
              value: ""
            }
          },
          treeData: {
            attrs: {
              data: []
            },
            props: {
              children: "children",
              label: "orgName",
              value: "id"
            }
          }
        },
        {
          elType: "dateTimePicker",
          id: "approvalTime",
          label: "发布时间",
          attrs: {
            value: "",
            size: "small",
            type: "datetimerange",
            clearable: true,
            "start-placeholder": "开始日期",
            "end-placeholder": "结束日期",
            "value-format": "yyyy-MM-dd HH:mm:ss"
          }
        },
        // {
        //   elType: "dateTimePicker",
        //   id: "approvalTime",
        //   label: "发布时间",
        //   attrs: {
        //     value: "",
        //     size: "small",
        //     clearable: true,
        //     type: "datetime",
        //     "value-format": "yyyy-MM-dd HH:mm:ss"
        //   }
        // },
        {
          elType: "select",
          id: "noticeState",
          label: "状态",
          attrs: {
            value: "",
            size: "small",
            clearable: true,
            filterable: true,
            "collapse-tags": true
          },
          options: [
            { label: "编辑中", value: "0" },
            { label: "待审批", value: "1" },
            { label: "已发布", value: "3" },
            { label: "驳回", value: "2" },
            { label: "解除", value: "4" },
            { label: "转响应", value: "5" }
          ]
        }
      ],
      // 表格信息
      table: {
        isSelectFlag: false, // 是否展示选择器
        compRef: "gjxm",
        isSequenceFlag: true, // 是否展示序号
        isShowPage: true, // 是否展示分页
        resetFlag: true,
        loading: false,
        title: "预警通知单列表",
        actions: [
          {
            id: "dialogVisible",
            text: "新增",
            type: "primary",
            btnAttr: { size: "small" }
          }
        ],
        tableData: [],
        columns: [
          {
            prop: "warningNoticeName",
            label: "预警通知单",
            align: "left",
            "min-width": "240px",
            render: (h, { row }) => {
              return (
                <div>
                  {
                    <span
                      style='width: 100%;' class='commonTableStyle'
                      {...{
                        on: {
                          click: () => {
                            this.detailList(row);
                          }
                        }
                      }}
                    >
                      {row.warningNoticeName}
                    </span>
                  }
                </div>
              );
            }
          },
          {
            prop: "dangerName",
            label: "险情类别",
            align: "center",
            "min-width": "60px"
          },
          {
            prop: "warningLvName",
            label: "预警级别",
            align: "center",
            "min-width": "60px"
          },
          {
            prop: "effectRange",
            label: "影响范围",
            align: "left"
          },
          {
            prop: "effectEndTime",
            label: "影响时间",
            align: "left",
            "min-width": "125px",
            render: (h, { row }) => {
              return (
                <div>
                  {
                    <span>
                      {row.effectStartTime}至{row.effectEndTime}
                    </span>
                  }
                </div>
              );
            }
          },
          {
            prop: "contact",
            label: "联系人",
            align: "left",
            "min-width": "170px",
            "show-overflow-tooltip": true
          },
          {
            prop: "createDeptName",
            label: "发布单位",
            align: "left"
          },
          {
            prop: "approvalTime",
            label: "发布时间",
            align: "center",
            "min-width": "130px"
          },
          {
            prop: "noticeState",
            label: "状态",
            align: "center",
            "min-width": "70px",
            formatter: (row, column, cellValue, index) => {
              if (cellValue === "0") {
                return "编辑中";
              } else if (cellValue === "1") {
                return "待审批";
              } else if (cellValue === "2") {
                return "驳回";
              } else if (cellValue === "3") {
                return "已发布";
              } else if (cellValue === "4") {
                return "解除";
              } else if (cellValue === "5") {
                return "转响应";
              } else if (cellValue === "6") {
                return "已失效";
              }
            }
          },
          {
            prop: "cz",
            label: "操作",
            align: "center",
            fixed: "right",
            "min-width": "200px",
            render: (h, scope) => {
              let arr = [];
              const userId = JSON.parse(sessionStorage.getItem("account")).id;
              // const roleCode = JSON.parse(sessionStorage.getItem("role")).roleCode;
              const tbPower = this.common.isHasPower("tbr");
              if (["0", "2"].includes(scope.row.noticeState) && tbPower) {
                arr = ["编辑", "删除"];
              } else if (scope.row.noticeState === "1" && scope.row.nextAssignee && scope.row.nextAssignee.includes(userId) && scope.row.operate === true) {
                arr = ["审批"];
              } else if (scope.row.noticeState === "3" && tbPower && scope.row.operate === true) {
                arr = ["预览", "调整", "解除", "转响应", "视频资源配置"]; // "调整", "解除",
              } else if (scope.row.noticeState === "3") {
                arr = ["预览"]; // "调整", "解除",
              } else if (scope.row.noticeState === "4" && tbPower) {
                arr = ["预览"];
              }
              return (
                <div>
                  {
                    arr.map(item => {
                      return (
                        <span style='color:#3561fd;cursor:pointer;margin:0 2px' {...{
                          on: {
                            click: () => {
                              this.actionHandle(item, scope);
                            }
                          }
                        }}>
                          {item}
                        </span>
                      );
                    })
                  }
                </div >
              );
            }
          }
        ],
        // 表格样式
        tableAttr: {
          // "max-height": "430px",
          // height: "430px",
          border: true,
          fit: true,
          stripe: true,
          "show-header": true,
          "highlight-current-row": true,
          "cell-style": {
            "font-size": "16px"
          },
          "header-cell-style": {
            "text-align": "center",
            "background-color": "#B1C8F9",
            border: "1px solid #ccc",
            "font-size": "16px"
          }
        }
      },
      // 新增的表单
      tableList: {
        isSelectFlag: true,
        compRef: "rwxx",
        autoHeight: true,
        isSequenceFlag: true,
        isShowPage: true,
        resetFlag: true,
        loading: false,
        actions: [
        ],
        tableData: [
          {
            measureRequire: "",
            unitDeptId: ""
          }
        ],
        columns: [
          {
            prop: "measureRequire",
            label: "有关措施要求",
            align: "center",
            "min-width": "200px",
            render: (h, { row }) => {
              return (
                <div class='peizhi'>
                  <LsdForm
                    compData={{
                      elType: "input",
                      id: "measureRequire",
                      label: "任务内容及要求",
                      attrs: {
                        autosize: true,
                        disabled: false,
                        value: "",
                        placeholder: "请输入",
                        min: 0,
                        type: "textarea"
                      }
                    }}
                    form={row}
                    {...{
                      on: {}
                    }}
                  ></LsdForm>
                </div>
              );
            }
          },
          {
            prop: "unitDeptId",
            // prop: "unitDeptId",
            label: "责任单位/部门",
            align: "center",
            "min-width": "80px",
            render: (h, scope) => {
              return (
                <div class='peizhi'>
                  <LsdForm
                    compData={{
                      elType: "lsdTree",
                      id: "unitDeptName",
                      name: "unitDeptId",
                      keyWord: "keyWord",
                      treeRef: "treeRef",
                      commonClick: true,
                      isSplice: true,
                      chooseUnit: true,
                      label: " ",
                      attrs: {
                        value: "",
                        clearable: true,
                        "collapse-tags": true
                      },
                      options: {
                        attrs: {
                          disabled: true,
                          value: ""
                        }
                      },
                      treeData: {
                        attrs: {
                          data: this.zrdwOption
                        },
                        props: {
                          children: "children",
                          label: "orgName",
                          value: "id"
                        }
                      }
                    }}
                    form={scope.row}
                    {...{
                      on: {
                        "node-click": (data, item) => { this.handleClick(data, item, scope); }
                      }
                    }}
                  ></LsdForm>
                  {/* <LsdForm
                    compData={{
                      elType: "select",
                      id: "unitDeptName",
                      name: "unitDeptName",
                      label: "责任部门",
                      // dic: "dic_zrbm",
                      attrs: {
                        value: "",
                        clearable: true,
                        filterable: true,
                        disabled: false,
                        multiple: false,
                        "collapse-tags": true
                      },
                      options: this.zrbmOption
                    }}
                    form={row}
                    {...{
                      on: {
                        change(val) {
                          row.unitDeptId = val;
                          this.zrbmOption.forEach(i => {
                            if (i.value === val) {
                              row.unitDeptName = i.label;
                            }
                          });
                        }
                      }
                    }}
                  ></LsdForm> */}
                </div>
              );
            }
          },
          {
            prop: "cz",
            label: "操作",
            align: "center",
            fixed: "right",
            "min-width": "40px",
            render: (h, { $index }) => {
              return (
                <div>
                  {
                    $index == this.tableList.tableData.length - 1 && (
                      <img
                        {...{
                          class: {},
                          style: {
                            width: "16px",
                            height: "16px",
                            "margin-right": "10px",
                            cursor: "pointer"
                          },
                          attrs: {
                            src: require("../../../assets/img/listAdd.png")
                          },
                          on: {
                            click: (scope) => {
                              this.$nextTick(() => {
                                this.tableList.tableData.push(
                                  {
                                    taskContent: "",
                                    dutyDeptId: ""
                                  }
                                );
                              });
                            }
                          }
                        }}
                      />
                    )
                  }
                  {this.tableList.tableData.length > 1 && (
                    <img
                      {...{
                        class: {},
                        style: {
                          width: "16px",
                          height: "16px",
                          cursor: "pointer"
                        },
                        attrs: {
                          src: require("../../../assets/img/listReduc.png")
                        },
                        on: {
                          click: () => {
                            this.tableList.tableData.splice($index, 1);
                          }
                        }
                      }}
                    />)}
                </div>
              );
            }
          }
        ],
        columns1: [
          {
            prop: "measureRequire",
            label: "有关措施要求",
            align: "left",
            "min-width": "200px",
            render: (h, { row }) => {
              return (
                <div class='peizhi'>
                  {row.measureRequire}
                </div>
              );
            }
          },
          {
            prop: "unitDeptName",
            label: "责任单位/部门",
            align: "center",
            "min-width": "80px",
            render: (h, { row }) => {
              return (
                <div class='peizhi'>
                  {row.unitDeptName}
                </div>
              );
            }
          }
        ],
        formLabel: {
          label: "有关措施要求：",
          prompt: true,
          width: "124px"
        },
        tableAttr: {
          // "max-height": "470px",
          border: true,
          fit: true,
          stripe: true,
          "show-header": true,
          "highlight-current-row": true,
          "cell-style": {
            "font-size": "16px"
          },
          "header-cell-style": {
            "text-align": "center",
            "background-color": "#B1C8F9",
            border: "1px solid #ccc",
            "font-size": "16px"
          }
        }
      },
      // 分页信息
      paginationAtrrs: {
        total: 0,
        "background": true,
        layout: "prev, pager, next",
        "current-page": 1,
        "page-size": 10
      },
      activeNames: ["1", "2", "3", "4", "5"], // 折叠面板默认展开列
      form: {}, // 筛选from
      pageNum: 1,
      pageSize: 10,
      // 弹窗信息
      dialogConfig: {
        title: "预警通知单",
        isShow: false, // 弹窗显示隐藏
        btnList: []
      },
      dialogConfig1: {
        title: "预警通知单",
        isShow: false, // 弹窗显示隐藏
        btnLists: [
          {
            name: "../assets/xiaziai.png",
            id: "BSubmit", // 事件名
            type: "primary",
            size: "mini"
          },
          {
            name: "../assets/daya.png",
            id: "submitForm",
            type: "primary",
            size: "mini"
          }
        ]
      },
      // 折叠面板信息
      titleConfig: [
        {
          title: "基本信息",
          name: "1",
          slot: "slot1"
        },
        {
          title: "措施要求",
          name: "2",
          slot: "slot2"
        },
        {
          title: "预警对象",
          name: "3",
          slot: "slot3"
        },
        {
          title: "填报信息",
          name: "4",
          slot: "slot4"
        }
        // {
        //   title: "审批信息",
        //   name: "5",
        //   slot: "slot5"
        // }
      ],
      // 弹窗表单信息
      formConfig: {
        formData: [
          {
            type: "input",
            label: "预警通知单",
            isDisabled: true,
            prop: "warningNoticeName",
            class: "sjgy",
            lableWidth: "130px"
          },
          {
            type: "select",
            label: "预警研判单",
            prop: "judgeName",
            isDisabled: false,
            name: "judgeName",
            class: "sjgy",
            lableWidth: "130px",
            option: []
          },
          {
            type: "input",
            label: "险情类别",
            prop: "dangerName",
            isDisabled: true,
            class: "half",
            lableWidth: "130px"
          },
          {
            type: "input",
            label: "预警级别",
            prop: "warningLvName",
            isDisabled: true,
            class: "half",
            lableWidth: "130px"
          },
          {
            type: "input",
            label: "影响范围",
            prop: "effectRange",
            isDisabled: true,
            class: "half",
            lableWidth: "130px"
          },
          {
            type: "dataPicker",
            label: "影响时间",
            start: "effectStartTime",
            isDisabled: true,
            end: "effectEndTime",
            class: "half",
            dateType: "datetimerange",
            lableWidth: "130px"
          },
          {
            type: "textarea",
            label: "事件概要",
            prop: "incidentOutline",
            isDisabled: true,
            class: "sjgy",
            lableWidth: "130px"
          }
        ],
        rules: {
          judgeName: [
            { required: true, message: "请选择预警研判单", trigger: "change" }
          ]
        }
      },
      // 弹窗表单信息
      formConfig1: {
        // disabled: false,
        formData: [],
        rules: {
          unitName: [
            { required: true, message: "请选择主送单位", trigger: "blur" }
          ],
          contactId: [
            { required: true, message: "请选择联系人", trigger: "blur" }
          ],
          deptId: [
            { required: true, message: "请选择预警部门", trigger: "blur" }
          ],
          outTheNewspaper: [
            { required: true, message: "请输入抄报", trigger: "change" }
          ],
          sendDuplicate: [
            { required: true, message: "请选择抄送", trigger: "change" }
          ]
        }
      },

      // 弹窗表单信息
      formConfig2: {
        formData: [
          {
            type: "input",
            label: "填报人",
            prop: "creator",
            isDisabled: true,
            class: "third",
            lableWidth: "130px"
          },
          {
            type: "input",
            label: "单位及部门",
            class: "third",
            isDisabled: true,
            prop: "createDeptName",
            lableWidth: "130px"
          },
          {
            type: "input",
            label: "填报时间",
            class: "third",
            isDisabled: true,
            prop: "createTime",
            lableWidth: "130px"
          }
        ]
      },
      // 弹窗表单信息
      formConfig3: {
        // disabled: true,
        formData: [
          {
            type: "input",
            label: "审批意见",
            prop: "approvalOpinion",
            class: "sjgy",
            lableWidth: "130px"
          },
          {
            type: "input",
            label: "审批人",
            prop: "approvalUser",
            isDisabled: true,
            class: "third",
            lableWidth: "130px"
          },
          {
            type: "input",
            label: "单位及部门",
            class: "third",
            isDisabled: true,
            prop: "approvalDept",
            lableWidth: "130px"
          },
          {
            type: "input",
            label: "审批时间",
            class: "third",
            isDisabled: true,
            prop: "approvalTime",
            lableWidth: "130px"
          }
        ]
      },
      judgeId: "",
      infoId: "",
      infoIds: "",
      fid: "",
      number: "",
      FilledBy: {},
      distinguish: 0,
      createDeptName: "",
      deptId: "",
      creator: "",
      createId: "",
      deptName: "",
      unitName: "",
      createDeptId: "",
      orgId: "",
      devicePlace: "",
      bdVideoDialog: {
        // 弹窗信息
        dialogConfig: {
          title: "视频资源绑定",
          isShow: false, // 弹窗显示隐藏
          btnList: [
            {
              name: "保存",
              id: "save",
              type: "primary",
              size: "small"
            },
            {
              name: "取消",
              id: "close1",
              size: "small"
            }
          ]
        },
        // 折叠面板信息
        titleConfig: [
          {
            title: "基本信息",
            name: "1",
            slot: "slot1"
          },
          {
            title: "视频资源",
            name: "2",
            slot: "slot2"
          }
        ],
        // 弹窗表单信息
        formConfig: {
          formData: [
            {
              type: "input",
              label: "预警通知单",
              isDisabled: true,
              prop: "warningNoticeName",
              class: "sjgy",
              lableWidth: "130px"
            },
            {
              type: "select",
              label: "预警研判单",
              prop: "judgeName",
              isDisabled: true,
              name: "judgeName",
              class: "sjgy",
              lableWidth: "130px",
              option: []
            },
            {
              type: "input",
              label: "险情类别",
              prop: "dangerName",
              isDisabled: true,
              class: "half",
              lableWidth: "130px"
            },
            {
              type: "input",
              label: "预警级别",
              prop: "warningLvName",
              isDisabled: true,
              class: "half",
              lableWidth: "130px"
            },
            {
              type: "input",
              label: "影响范围",
              prop: "effectRange",
              isDisabled: true,
              class: "half",
              lableWidth: "130px"
            },
            {
              type: "dataPicker",
              label: "影响时间",
              start: "effectStartTime",
              isDisabled: true,
              end: "effectEndTime",
              class: "half",
              dateType: "datetimerange",
              lableWidth: "130px"
            },
            {
              type: "textarea",
              label: "事件概要",
              prop: "incidentOutline",
              isDisabled: true,
              class: "sjgy",
              lableWidth: "130px"
            }
          ]
        },
        formConfig1: {
          formData: [
            {
              type: "select",
              label: "影响范围",
              prop: "emergencyEvent",
              name: "eventName",
              class: "half",
              lableWidth: "146px",
              option: []
            },
            {
              type: "select",
              label: "视频资源类别",
              prop: "eventCode",
              name: "eventName",
              dic: "dic_sjlb",
              class: "half",
              option: []
            }
          ],
          rules: {
            emergencyEvent: [
              { required: true, message: "请选择责任单位及部门", trigger: "change" }
            ],
            eventCode: [
              { required: true, message: "请选择责任人", trigger: "change" }
            ]
          },
          // 表格信息
          table: {
            compRef: "spmc",
            isSequenceFlag: true,
            isShowPage: true,
            resetFlag: true,
            loading: false,
            tableData: [
              {
                videoName: "奥园东路变-正大门围墙左侧1号布控球"
              }
            ],
            columns: [
              {
                prop: "videoName",
                label: "重点关注视频资源名称",
                align: "center",
                "min-width": "200px"
              },
              {
                prop: "cz",
                label: "操作",
                align: "center",
                fixed: "right",
                "min-width": "40px",
                render: (h, { $index }) => {
                  return (
                    <div>
                      <img
                        {...{
                          class: {},
                          style: {
                            width: "16px",
                            height: "16px",
                            cursor: "pointer"
                          },
                          attrs: {
                            src: require("../../../assets/img/listReduc.png")
                          },
                          on: {
                            click: () => {
                              this.bdVideoDialog.formConfig1.table.tableData.splice($index, 1);
                            }
                          }
                        }}
                      />
                    </div>
                  );
                }
              }
            ],
            tableAttr: {
              "max-height": "470px",
              stripe: false,
              border: true,
              fit: true,
              "show-header": true,
              "highlight-current-row": true,
              "cell-style": {
                "font-size": "16px"
              },
              "header-cell-style": {
                "text-align": "center",
                "background-color": "#B1C8F9",
                border: "1px solid #ccc",
                "font-size": "16px"
              }
            }
          }
        }
      },
      props: {
        label: "name",
        children: "zones"
      },
      count: 1,
      geo: "",
      rangeInfo: [], // 影响范围
      types: 0,
      zrdwOption: []
    };
  },
  watch: {
    "$route.query.noticeState": {
      handler() {
        this.pageNum = 1;
        this.list();
      },
      deep: true
    }
  },
  mounted() {
    this.list();
    this.getUnitTree();
    this.getInputVal();
    if (this.$route.query.id) {
      this.type = this.$route.query.type;
      this.types = this.$route.query.types;
      this.dialogConfig.isShow = true;
      this.$nextTick(() => {
        this.$refs.formComponent1.form.unitId = [];
        this.$refs.formComponent1.form.deptId = [];
        this.$refs.formComponent1.form.unitName = [];
        this.$refs.formComponent1.form.deptName = [];
      });
      this.dialogConfig.btnList = [
        {
          name: "提交",
          id: "BSubmit", // 事件名
          type: "primary",
          size: "small"
        },
        {
          name: "保存",
          id: "submitForm",
          size: "small"
        },
        {
          name: "取消",
          id: "Qxiao",
          size: "small"
        }
      ];
      this.getInputVals();
      this.GoGetAlertInformation();
    }
    if (JSON.parse(sessionStorage.getItem("role")).roleCode === "province_company_leadership") {
      this.table.actions = [];
    }
    const FilledBy = {
      creator: JSON.parse(sessionStorage.getItem("account")).realName,
      creatorId: JSON.parse(sessionStorage.getItem("account")).id,
      createDeptId: JSON.parse(sessionStorage.getItem("org")).orgCode,
      // createDeptName: JSON.parse(sessionStorage.getItem("org")).orgName,
      createDeptName: sessionStorage.getItem("dwbmName"),
      createTime: showTime(new Date()),
      approvalUserId: JSON.parse(sessionStorage.getItem("account")).id,
      approvalUser: JSON.parse(sessionStorage.getItem("account")).realName,
      pprovalDeptId: JSON.parse(sessionStorage.getItem("org")).orgCode,
      // approvalDept: JSON.parse(sessionStorage.getItem("org")).orgName,
      approvalDept: sessionStorage.getItem("dwbmName"),
      approvalTime: showTime(new Date())
    };
    this.FilledBy = FilledBy;
  },
  methods: {
    // 工作流提交
    gzlSubmit(bizKey, variable) {
      const data = {
        bizKey,
        flowKey: "warning_notification_002",
        taskId: "task1",
        callbackUrl: "/warning/warningNotification/handleFlowNotice",
        idea: "1",
        variable
      };
      const successCallBack = () => {
        this.$message({
          message: "报送成功",
          type: "success"
        });
        this.$router.push({ query: { noticeState: this.$route.query.noticeState } });
        this.dialogConfig.isShow = false;
        this.list();
      };
      flowSubmit(data, successCallBack, "提交", true);
    },
    // 工作流审批
    gzlAudit(type, variable) {
      const data = {
        bizKey: this.fid,
        flowKey: "warning_notification_002",
        taskId: "task2",
        callbackUrl: "/warning/warningNotification/handleFlowNotice",
        idea: type === 3 ? "1" : "0",
        variable,
        ideaMsg: this.$refs.formComponent3.form.approvalOpinion ? this.$refs.formComponent3.form.approvalOpinion : type === 3 ? "同意" : "驳回"
      };
      const successCallBack = () => {
        this.$message({
          message: `${type === 3 ? "审核" : "驳回"}成功`,
          type: "success"
        });
        this.dialogConfig.isShow = false;
        this.$router.push({ query: { noticeState: this.$route.query.noticeState } });
        this.list();
      };
      flowSubmit(data, successCallBack, "审核");
    },
    handleCheckChange(data, checked, indeterminate) {
      console.log(data, checked, indeterminate);
    },
    handleNodeClick(data, node, item) {
      if (item.label === "主送单位") {
        // data.porgName = value;
        const result = this.$refs.formComponent1.form.unitName;
        if (result.includes(data.orgName)) return;
        else {
          this.$refs.formComponent1.form.unitName.push(data.orgName);
          this.$refs.formComponent1.form.unitId.push(data.id);
        }

      } else if (item.label === "预警部门") {
        const result = this.$refs.formComponent1.form.deptName;
        if (result.includes(data.orgName)) return;
        else {
          this.$refs.formComponent1.form.deptId.push(data.id);
          this.$refs.formComponent1.form.deptName.push(data.orgName);
        }
      }
    },
    loadNode(node, resolve) {
      if (node.level === 0) {
        return resolve([{ name: "region1" }, { name: "region2" }]);
      }
      if (node.level > 3) return resolve([]);

      var hasChild;
      if (node.data.name === "region1") {
        hasChild = true;
      } else if (node.data.name === "region2") {
        hasChild = false;
      } else {
        hasChild = Math.random() > 0.5;
      }

      setTimeout(() => {
        var data;
        if (hasChild) {
          data = [{
            name: "zone" + this.count++
          }, {
            name: "zone" + this.count++
          }];
        } else {
          data = [];
        }

        resolve(data);
      }, 500);
    },
    // 树状选择
    deptChoose(val, item) {
      this.$set(this.form, "infoSource", val[0].orgName);
      this.orgId = val[0].id;
    },
    // 树状接口
    getUnitTree() {
      getSubclassUntilLists({ orgId: JSON.parse(sessionStorage.getItem("org")).orgId }).then(res => {
        this.formData[5].treeData.attrs.data = res;
      });
    },
    getOrgTree() {
      this.formConfig1.formData.forEach((item) => {
        // 树状  派发单位/部门
        if (item.prop === "unitName") {
          getSubclassUntilList({ orgId: JSON.parse(sessionStorage.getItem("org")).orgId }).then(res => {
            const arr = [];
            res[0].children.forEach((i, index) => {
              if (
                i.orgName !== "公司本部" &&
                i.orgName !== "县级公司"
              ) {
                arr.push(i);
              }
            });
            res[0].children = arr;
            item.treeData.data = res;
          });
        }
      });
    },
    getOrgTrees() {
      this.formConfig1.formData.forEach((item) => {
        // 树状  派发单位/部门
        if (item.prop === "deptName") {
          getOrgDepartmentList({ orgId: JSON.parse(sessionStorage.getItem("org")).orgId }).then(res => {
            const add = [];
            res[0].children.forEach((i, index) => {
              if (
                i.orgName !== "直属单位" &&
                i.orgName !== "地市公司" &&
                i.orgName !== "县级公司"
              ) {
                add.push(i);
              }
            });
            res[0].children = add;
            item.treeData.data = res;
          });
        }
      });
    },
    // 弹窗按钮点击事件 对应id绑定事件
    handleBtn(item) {
      this[item.id]();
    },
    // 重置
    reset() {
      this.form = this.$options.data().form;
      this.pageNum = 1;
      this.$refs.gjxm.paginationAtrrsInner["current-page"] = 1;
      this.list();
    },
    handleSearch() {
      this.$refs.gjxm.paginationAtrrsInner["current-page"] = 1;
      this.pageNum = 1;
      this.query();
    },
    // 检索
    async query() {
      const parmas = {
        pageNum: this.pageNum,
        pageSize: this.pageSize,
        warningNoticeName: this.form.warningNoticeName,
        dangerCode: this.form.dangerCode,
        warningLvCode: this.form.warningLvCode,
        effectRange: this.form.effectRange,
        effectStartTime: this.form.effectStartTime ? this.form.effectStartTime[0] : "", // 开始时间
        effectEndTime: this.form.effectStartTime ? this.form.effectStartTime[1] : "", // 结束时间
        // approvalTime: this.form.approvalTime,
        approvalStartTime: this.form.approvalTime ? this.form.approvalTime[0] : "",
        approvalEndTime: this.form.approvalTime ? this.form.approvalTime[1] : "",
        createDeptId: this.orgId,
        receiveTimes: this.form.receiveTimes,
        noticeState: this.$route.query.noticeState || "",
        flowKey: "warning_notification_001"
      };
      const res = await listPage(parmas);
      //  const num = 0;
      // this.table.tableData = res.data;
      //  const tableData = res.data;
      res.data.forEach((item, index) => {
        if (item.approvalDept === null) {
          item.approvalDep = item.approvalDept;
        }
        // else if (item.noticeState === "7") {
        //  console.log(item, "----item");
        // tableData.splice(index, 1);
        // 处理过滤后列表总数
        //  num++;
        // }
      });
      this.$set(this.table, "tableData", res.data);
      this.paginationAtrrs.total = res.total;
    },
    // 保存
    async submitForm() {
      this.$refs.formComponent.isValidate();
      this.$refs.formComponent1.isValidate();
      const flag = this.$refs.formComponent.flag;
      const flag1 = this.$refs.formComponent1.flag;
      let emptFlag = true;
      const newTableData = this.tableList.tableData;
      newTableData.forEach((item, index) => {
        if (item.measureRequire === "" || item.measureRequire === null || item.measureRequire === undefined) {
          this.$message({
            message: `有关措施要求列表，第${index + 1}条有关措施要求不能为空`,
            type: "error"
          });
          emptFlag = false;
        } else if (item.unitDeptId === "" || item.unitDeptId === null || item.unitDeptId === undefined) {
          this.$message({
            message: `有关措施要求列表，第${index + 1}条责任单位/部门不能为空`,
            type: "error"
          });
          emptFlag = false;
        }
      });
      if (flag && flag1 && emptFlag) {
        const parmas = {
          judgeId: this.judgeId,
          infoId: this.infoId,
          infoIds: this.infoIds,
          warningNoticeName: this.$refs.formComponent.form.warningNoticeName,
          dangerName: this.$refs.formComponent.form.dangerName,
          dangerCode: this.$refs.formComponent.form.dangerCode,
          warningLvName: this.$refs.formComponent.form.warningLvName,
          warningLvCode: this.$refs.formComponent.form.warningLvCode,
          effectEndTime: this.$refs.formComponent.form.effectEndTime,
          effectStartTime: this.$refs.formComponent.form.effectStartTime,
          adjustExplain: this.$refs.formComponent.form.adjustExplain,
          eventOutline: this.$refs.formComponent.form.incidentOutline,
          unitId: this.$refs.formComponent1.form.unitId.join("、"),
          unitName: this.$refs.formComponent1.form.unitName instanceof Array ? this.$refs.formComponent1.form.unitName.join("、") : this.$refs.formComponent1.form.unitName,
          deptId: this.$refs.formComponent1.form.deptId.join("、"),
          deptName: this.$refs.formComponent1.form.deptName.join("、"),
          contact: this.$refs.formComponent1.form.contact instanceof Array ? this.$refs.formComponent1.form.contact.join("、") : this.$refs.formComponent1.form.contact,
          contactId: this.$refs.formComponent1.form.contactId.join(),
          outTheNewspaper: this.$refs.formComponent1.form.outTheNewspaper instanceof Array ? this.$refs.formComponent1.form.outTheNewspaper.join("、") : this.$refs.formComponent1.form.outTheNewspaper,
          // newspaperId: this.$refs.formComponent1.form.newspaperId.join(),
          sendDuplicate: this.$refs.formComponent1.form.sendDuplicate instanceof Array ? this.$refs.formComponent1.form.sendDuplicate.join("、") : this.$refs.formComponent1.form.sendDuplicate,
          rangeInfo: this.rangeInfo
          // sendDuplicateId: this.$refs.formComponent1.form.sendDuplicateId.join()
        };
        if (this.type === 1) {
          parmas.measureSaveDtoList = this.tableList.tableData;
          parmas.number = this.number;
          parmas.creator = JSON.parse(sessionStorage.getItem("account")).realName;
          parmas.creatorId = JSON.parse(sessionStorage.getItem("account")).id;
          parmas.createDeptId = JSON.parse(sessionStorage.getItem("org")).orgCode;
          parmas.createDeptName = sessionStorage.getItem("dwbmName");
          const res = await warningNotificationSave(parmas);
          if (res) {
            this.$message({
              message: "保存成功",
              type: "success"
            });
            this.$router.push({ query: { noticeState: this.$route.query.noticeState } });
            this.list();
            this.dialogConfig.isShow = false;
          }
        } else if (this.type === 2 || this.types) {
          parmas.measureUpdDtos = this.tableList.tableData;
          parmas.creator = JSON.parse(sessionStorage.getItem("account")).realName;
          parmas.creatorId = JSON.parse(sessionStorage.getItem("account")).id;
          parmas.createDeptId = JSON.parse(sessionStorage.getItem("org")).orgCode;
          parmas.createDeptName = sessionStorage.getItem("dwbmName");
          parmas.number = this.number;
          if (this.fid) {
            parmas.id = this.fid;
            const res = await warningNotificationUpdById(parmas);
            if (res) {
              this.gzlSubmit(this.fid, parmas);
            }
          } else {
            const res = await warningNotificationSave(parmas);
            if (res) {
              this.gzlSubmit(res, parmas);
            }
          }
        } else if (this.type === 3) {
          parmas.measureUpdDtos = this.tableList.tableData;
          parmas.approveSign = "pass";
          parmas.id = this.fid;
          parmas.approvalOpinion = this.$refs.formComponent3.form.approvalOpinion ? this.$refs.formComponent3.form.approvalOpinion : "同意";
          parmas.approvalUserId = JSON.parse(sessionStorage.getItem("account")).id;
          parmas.approvalUser = JSON.parse(sessionStorage.getItem("account")).realName;
          parmas.approvalDeptId = JSON.parse(sessionStorage.getItem("org")).orgCode;
          parmas.approvalDept = sessionStorage.getItem("dwbmName");
          parmas.creatorId = this.creatorId;
          parmas.createDeptId = this.createDeptId;
          parmas.createDeptName = this.createDeptName === "" ? "同意" : this.createDeptName;
          parmas.creator = this.creator;
          const res = await warningNotificationApprove(parmas);
          if (res) {
            this.gzlAudit(3, parmas);
          }
        } else if (this.type === 4) {
          parmas.measureUpdDtos = this.tableList.tableData;
          parmas.approvalOpinion = this.$refs.formComponent3.form.approvalOpinion ? this.$refs.formComponent3.form.approvalOpinion : "驳回";
          parmas.approvalUserId = JSON.parse(sessionStorage.getItem("account")).id;
          parmas.approvalUser = JSON.parse(sessionStorage.getItem("account")).realName;
          parmas.approvalDeptId = JSON.parse(sessionStorage.getItem("org")).orgCode;
          parmas.approvalDept = sessionStorage.getItem("dwbmName");
          parmas.creatorId = this.creatorId;
          parmas.createDeptId = this.createDeptId;
          parmas.createDeptName = this.createDeptName;
          parmas.creator = this.creator;
          parmas.approveSign = "reject";
          parmas.id = this.fid;
          const res = await warningNotificationApprove(parmas);
          if (res) {
            this.gzlAudit(4, parmas);
          }
        } else if (this.type === 5) {
          parmas.creator = JSON.parse(sessionStorage.getItem("account")).realName;
          parmas.creatorId = JSON.parse(sessionStorage.getItem("account")).id;
          parmas.createDeptId = JSON.parse(sessionStorage.getItem("org")).orgCode;
          parmas.createDeptName = sessionStorage.getItem("dwbmName");
          parmas.measureUpdDtos = this.tableList.tableData;
          parmas.id = this.fid;
          const res = await warningNotificationUpdById(parmas);
          if (res) {
            this.$message({
              message: "修改成功",
              type: "success"
            });
            this.list();
            this.dialogConfig.isShow = false;
            this.$router.push({ query: { noticeState: this.$route.query.noticeState } });
          }
        }
      }
    },
    // 弹窗关闭图标
    close() {
      this.$refs.formComponent.form = this.$refs.formComponent.$options.data().form;
      this.$refs.formComponent1.form = this.$refs.formComponent1.$options.data().form;
      this.$nextTick(() => {
        this.$refs.formComponent.$refs.formInlines.clearValidate();
        this.$refs.formComponent1.$refs.formInlines.clearValidate();

      });
      if (this.$route.query.type === 1) {
        this.$router.push({
          name: "EarlyJudgmentList"
        });
      }
      this.tableList.tableData = [{
        measureRequire: "",
        unitDeptId: ""
      }];
      this.$router.push({ query: { noticeState: this.$route.query.noticeState } });
      this.list();
      this.dialogConfig.isShow = false;
    },
    closes() {
      this.dialogConfig1.isShow = false;
    },
    // 提交
    async BSubmit() {
      this.type = 2;
      this.submitForm();
    },
    // 取消
    Qxiao() {
      this.$refs.formComponent.form = this.$refs.formComponent.$options.data().form;
      this.$refs.formComponent1.form = this.$refs.formComponent1.$options.data().form;
      this.$nextTick(() => {
        this.$refs.formComponent.$refs.formInlines.clearValidate();
        this.$refs.formComponent1.$refs.formInlines.clearValidate();
      });
      if (this.$route.query.type === 1) {
        this.$router.push({
          name: "EarlyJudgmentList"
        });
      }
      this.tableList.tableData = [{
        measureRequire: "",
        unitDeptId: ""
      }];
      this.$router.push({ query: { noticeState: this.$route.query.noticeState } });
      this.list();
      this.dialogConfig.isShow = false;
    },
    // 获取下拉框数据
    getInputVal() {
      this.formData.forEach((item) => {
        if (item.dic) {
          getDictByGroup({ groupCode: item.dic }).then(res => {
            const option = res.map((item) => {
              return {
                label: item.dicName,
                value: Number(item.dicCode)
              };
            });
            item.options = option;
          });
        }
      });
    },
    // 获取下拉框数据
    getInputVals() {
      this.formConfig1.formData.forEach((item) => {
        // if (item.label === "主送单位") {
        //   if (item.dic) {
        //     getOrganizationList({ orgType: item.dic }).then(res => {
        //       console.log(res)
        //       const option = res.map((item) => {
        //         return {
        //           label: item.orgName,
        //           value: item.orgCode
        //         }
        //       })
        //       item.option = option
        //     })
        //   }
        // }
        // if (item.label === "预警部门") {
        //   if (item.dic) {
        //     getOrganizationList({ orgType: item.dic }).then(res => {
        //       const option = res.map((item) => {
        //         return {
        //           label: `${item.orgName}`,
        //           value: item.orgCode
        //         }
        //       })
        //       item.option = option
        //     })
        //   }
        // }ssbmId
        if (item.label === "联系人") {
          getPersonApi({ orgId: JSON.parse(sessionStorage.getItem("org")).orgId, ssbmId: JSON.parse(sessionStorage.getItem("org")).ssbmId }).then(res => {
            const option = res.map((item) => {
              const phone = item.phone === null ? "" : `：(${item.phone})`;
              return {
                label: `${item.orgName}${item.realName}${phone}`,
                value: item.id
              };
            });
            item.option = option;
          });
        } else if (item.label === "预警部门") {
          getOrgDepartmentList({ orgId: JSON.parse(sessionStorage.getItem("org")).orgId }).then(res => {
            const option = res.map((item) => {
              return {
                label: `${item.orgName}`,
                value: item.id
              };
            });
            item.option = option;
          });
        }



        //   {/* if (item.label === "抄报") {
        //  if (item.dic) {
        //  getDictByGroup({ groupCode: item.dic }).then(res => {
        //  const option = res.map((item) => {
        //  return {
        //    label: item.dicName,
        //   value: item.dicCode
        //  };
        // });
        // item.option = option;
        // });
        //  }
        //   }
        //   if (item.label === "抄送") {
        // if (item.dic) {
        //  getDictByGroup({ groupCode: item.dic }).then(res => {
        // const option = res.map((item) => {
        // return {
        //  label: item.dicName,
        // value: item.dicCode
        //  };
        // });
        //  item.option = option;
        // });
        // }
        //  } */}
      });
    },
    // 列表
    async list() {
      const parmas = {
        pageNum: this.pageNum,
        pageSize: this.pageSize,
        noticeState: this.$route.query.noticeState,
        roleCode: JSON.parse(sessionStorage.getItem("role")).roleCode,
        flowKey: "warning_notification_002"
      };

      const res = await listPage(parmas);
      let num = 0;
      // this.table.tableData = res.data;
      const tableData = res.data;
      res.data.forEach((item, index) => {
        if (item.approvalDept === null) {
          item.approvalDep = item.approvalDept;
        } else if (item.noticeState === "7") {
          console.log(item, "----item");
          tableData.splice(index, 1);
          // 处理过滤后列表总数
          num++;
        }
        // else {
        // item.approvalDept = (item.approvalDept).includes("司") ? item.approvalDept.split("司")[0] + "司" : item.approvalDept;
        // }
      });
      this.$set(this.table, "tableData", res.data);
      this.paginationAtrrs.total = Number(res.total) - num;
    },
    // 抛出列表按钮
    onActionClick(item, index) {
      this[item.id](); // 调用按钮对应方法
    },
    // 获取新增里面的部门字典值
    async Hdepartment() {

      sameLeveltree({ accountId: this.FilledBy.creatorId }).then(res => {
        this.zrdwOption = res;
      });
    },
    // 任务分配组织机构点击事件
    handleClick(data, item, scope) {
      this.$set(this.tableList.tableData[scope.$index], "unitDeptName", data.fullName);
      this.$set(this.tableList.tableData[scope.$index], "unitDeptId", data.id);
    },
    // 新增
    dialogVisible() {
      this.formConfig1.formData = [
        {
          type: "selectTree",
          label: "主送单位",
          prop: "unitName",
          name: "unitId",
          title: "主送单位选择",
          choose: false,
          isDisabled: false,
          multiple: true,
          keyWord: "keyWord",
          treeRef: "treeRef",
          commonClick: false,
          ref: "tree_select",
          class: "sjgy",
          lableWidth: "130px",
          option: [],
          treeData: {
            data: [],
            default: ["1"],
            checked: [],
            props: {
              children: "children",
              label: "orgName",
              value: "id"
            }
          }
        },
        // {
        //   type: "cascader",
        //   label: "预警部门",
        //   prop: "deptId",
        //   // name: "unitName",
        //   // dic: "unit",
        //   isDisabled: false,
        //   class: "sjgy",
        //   multiple: true,
        //   lableWidth: "130px",
        //   option: [],
        //   props: {
        //     label: "orgName",
        //     value: "id",
        //     checkStrictly: true,
        //     emitPath: false,
        //     multiple: true,
        //     expandTrigger: "hover"
        //   }
        // },
        {
          type: "select",
          label: "预警部门",
          prop: "deptId",
          name: "deptName",
          filterable: true,
          multiple: true,
          isDisabled: false,
          class: "sjgy",
          lableWidth: "130px",
          option: []
        },
        // {
        //  type: "selectTree",
        //  label: "预警部门",
        // prop: "deptName",
        // name: "deptId",
        // title: "预警部门选择",
        // choose: false,
        // isDisabled: false,
        //  multiple: true,
        //  keyWord: "keyWord1",
        // treeRef: "treeRef1",
        // commonClick: false,
        // ref: "tree_select1",
        // class: "sjgy",
        // lableWidth: "130px",
        // option: [],
        // treeData: {
        //  data: [],
        // default: ["1"],
        // checked: [],
        // props: {
        //   children: "children",
        // label: "orgName",
        //   value: "id"
        // }
        // }
        // },
        // {
        //   type: "select",
        //   label: "预警部门",
        //   name: "deptName",
        //   prop: "deptId",
        //   class: "sjgy",
        //   isDisabled: false,
        //   dic: "dept",
        //   multiple: true,
        //   lableWidth: "130px",
        //   option: []
        // },
        {
          type: "select",
          label: "联系人",
          prop: "contactId",
          name: "contact",
          filterable: true,
          multiple: true,
          isDisabled: false,
          class: "sjgy",
          lableWidth: "130px",
          option: []
        },
        {
          type: "input",
          label: "抄报",
          dic: "dic_cb",
          prop: "outTheNewspaper",
          name: "newspaperId",
          isDisabled: false,
          class: "half",
          multiple: true,
          lableWidth: "130px",
          option: []
        },
        {
          type: "input",
          label: "抄送",
          dic: "dic_cs",
          prop: "sendDuplicate",
          name: "sendDuplicateId",
          isDisabled: false,
          class: "half",
          multiple: true,
          lableWidth: "130px",
          option: []
        }
      ];
      this.getOrgTree();
      this.getOrgTrees();
      this.dialogConfig.isShow = true;
      this.formConfig1.formData[0].isDisabled = false;
      this.formConfig1.formData[1].isDisabled = false;
      this.formConfig1.formData[2].isDisabled = false;
      this.formConfig1.formData[3].isDisabled = false;
      this.formConfig1.formData[4].isDisabled = false;
      this.formConfig.formData[1].isDisabled = false;
      this.$nextTick(() => {
        this.$set(this.$refs.formComponent1.form, "unitId", []);
        this.$set(this.$refs.formComponent1.form, "deptId", []);

        this.$set(this.$refs.formComponent1.form, "unitName", []);

        this.$set(this.$refs.formComponent1.form, "deptName", []);

        // this.$refs.formComponent1.form.unitId = [];
        // this.$refs.formComponent1.form.deptId = [];

        // this.$refs.formComponent1.form.unitName = [];
        // this.$refs.formComponent1.form.deptName = [];
        this.formConfig.formData[1].isDisabled = false;
        this.$refs.formComponent2.form = this.FilledBy;
      });
      this.formConfig.rules = {
        judgeName: [
          { required: true, message: "请选择预警研判单", trigger: "change" }
        ]
      };
      this.formConfig1.rules = {
        unitName: [
          { required: true, message: "请选择主送单位", trigger: "blur" }
        ],
        contactId: [
          { required: true, message: "请选择联系人", trigger: "blur" }
        ],
        deptId: [
          { required: true, message: "请选择预警部门", trigger: "blur" }
        ],
        sendDuplicate: [
          { required: true, message: "请选择抄报", trigger: "blur" }
        ],
        outTheNewspaper: [
          { required: true, message: "请选择抄送", trigger: "blur" }
        ]
      };
      this.type = 1;
      this.GetAlertInformation();
      this.Hdepartment();
      this.getInputVals();
      this.dialogConfig.btnList = [
        {
          name: "提交",
          id: "BSubmit", // 事件名
          type: "primary",
          size: "small"
        },
        {
          name: "保存",
          id: "submitForm",
          size: "small"
        },
        {
          name: "取消",
          id: "Qxiao",
          size: "small"
        }
      ];
    },
    // 列表表格按钮事件
    actionHandle(item, scope) {
      if (item === "编辑") {
        this.HanEdit(scope.row);
        console.log(scope.row);
      } else if (item === "删除") {
        this.detailForm(scope.row);
      } else if (item === "审批") {
        this.ApprovalForm(scope.row);
      } else if (item === "预览") {
        this.preview(scope.row);
      } else if (item === "视频资源配置") {
        this.BindVideo(scope.row);
      } else if (item === "调整") {
        this.$router.push({
          name: "AdjustmentList",
          query: {
            id: scope.row.id,
            isShow: true,
            type: 1,
            noticeState: this.$route.query.noticeState
          }
        });
      } else if (item === "解除") {
        this.$router.push({
          name: "AdjustmentList",
          query: {
            id: scope.row.id,
            isShow: true,
            type: 2,
            noticeState: this.$route.query.noticeState
          }
        });
      } else if (item === "转响应") {
        this.$router.push({
          name: "EmergencyList",
          query: {
            id: scope.row.id,
            isShow: true,
            type: 1
          }
        });
      }
    },
    // 打印
    tzdPrint() {
      detailList({ id: this.id }).then(res => {

        getIssueJudgeData({ id: res.judgeId }).then(data => {
          const readerFun = () => {
            // const formData = {};
            const html = Printer.assembleDomHtml(res, 0, data);
            return html;
          };
          window.open("").document.write(Printer.printerOperationTicket(readerFun));
        });

      });


    },
    // 下载
    handleBtnX() {

      doDownPdf({ noticeId: this.id }).then(res => {
        const response = res; // 后端返回的数据流
        const filename = "预警通知单.pdf"; // 下载的文件名
        // 创建一个 Blob URL，指向数据流
        const blobUrl = URL.createObjectURL(response);
        // 创建一个链接元素
        const link = document.createElement("a");
        link.href = blobUrl;
        link.target = "_blank";
        link.download = filename;
        // 触发下载
        link.click();
        // 释放 Blob URL
        URL.revokeObjectURL(blobUrl);
      });

    },
    // 预览
    preview(id) {
      this.dialogConfig1.isShow = true;
      this.id = id.id;
    },
    // 获取预警信息下拉的数据
    GetAlertInformation() {
      this.formConfig.formData.map(item => {
        if (item.label === "预警研判单") {
          getAlreadyIssueJudge().then(res => {
            const option = res.map((item) => {
              return {
                label: item.judgeName,
                value: item.id
              };
            });
            item.option = option;

          });
        }
      });
    },
    // 预警研判生成通知单
    GoGetAlertInformation() {
      this.formConfig1.formData = [{
        type: "selectTree",
        label: "主送单位",
        prop: "unitName",
        name: "unitId",
        title: "主送单位选择",
        choose: false,
        isDisabled: false,
        multiple: true,
        keyWord: "keyWord",
        treeRef: "treeRef",
        commonClick: false,
        ref: "tree_select",
        class: "sjgy",
        lableWidth: "130px",
        option: [],
        treeData: {
          data: [],
          default: ["1"],
          checked: [],
          props: {
            children: "children",
            label: "orgName",
            value: "id"
          }
        }
      },
      // {
      //   type: "cascader",
      //   label: "预警部门",
      //   prop: "deptId",
      //   // name: "unitName",
      //   // dic: "unit",
      //   isDisabled: false,
      //   class: "sjgy",
      //   multiple: true,
      //   lableWidth: "130px",
      //   option: [],
      //   props: {
      //     label: "orgName",
      //     value: "id",
      //     checkStrictly: true,
      //     emitPath: false,
      //     multiple: true,
      //     expandTrigger: "hover"
      //   }
      // },
      {
        type: "select",
        label: "预警部门",
        prop: "deptId",
        name: "deptName",
        filterable: true,
        multiple: true,
        isDisabled: false,
        class: "sjgy",
        lableWidth: "130px",
        option: []
      },

      // {
      //   type: "select",
      //   label: "预警部门",
      //   name: "deptName",
      //   prop: "deptId",
      //   class: "sjgy",
      //   isDisabled: false,
      //   dic: "dept",
      //   multiple: true,
      //   lableWidth: "130px",
      //   option: []
      // },
      {
        type: "select",
        label: "联系人",
        prop: "contactId",
        name: "contact",
        filterable: true,
        multiple: true,
        isDisabled: false,
        class: "sjgy",
        lableWidth: "130px",
        option: []
      },
      {
        type: "input",
        label: "抄报",
        dic: "dic_cb",
        prop: "outTheNewspaper",
        name: "newspaperId",
        isDisabled: false,
        class: "half",
        multiple: true,
        lableWidth: "130px",
        option: []
      },
      {
        type: "input",
        label: "抄送",
        dic: "dic_cs",
        prop: "sendDuplicate",
        name: "sendDuplicateId",
        isDisabled: false,
        class: "half",
        multiple: true,
        lableWidth: "130px",
        option: []
      }
      ];
      this.getInputVals();
      this.getOrgTree();
      this.getOrgTrees();
      this.Hdepartment();
      this.formConfig.formData[1].isDisabled = true;
      this.formConfig.rules.judgeName = [];
      this.$nextTick(() => {
        this.$refs.formComponent2.form = this.FilledBy;
      });
      this.GetAlertInformation();
      // this.Hdepartment()
      getIssueJudgeData({ id: this.$route.query.id }).then(res => {
        this.infoId = res.infoId;
        this.number = res.number;
        this.judgeId = this.$route.query.id;
        this.rangeInfo = res.rangeDetailVos;
        const rangeDetailVos = res.rangeDetailVos.map(item => {
          return item.effectRange;
        });
        this.$set(this.$refs.formComponent.form, "effectRange", rangeDetailVos.join("、"));
        this.$set(this.$refs.formComponent.form, "judgeName", res.judgeName);
        this.$set(this.$refs.formComponent.form, "incidentOutline", res.incidentOutline);
        this.$set(this.$refs.formComponent.form, "warningLvName", res.warningLvName);
        this.$set(this.$refs.formComponent.form, "dangerName", res.dangerName);
        // this.$set(this.$refs.formComponent.form, "effectRange", res.effectRange);
        this.$set(this.$refs.formComponent.form, "warningNoticeName", res.warningNoticeName);
        this.$set(this.$refs.formComponent.form, "effectStartTime", res.effectStartTime);
        this.$set(this.$refs.formComponent.form, "effectEndTime", res.effectEndTime);
      });
    },
    // 预警研判单 下拉监听
    handleChange(val) {
      this.judgeId = val;
      getIssueJudgeData({ id: val }).then(res => {
        this.infoId = res.infoId;
        this.infoIds = res.infoIds;
        this.number = res.number;
        this.rangeInfo = res.rangeDetailVos;
        const rangeDetailVos = res.rangeDetailVos.map(item => {
          return item.effectRange;
        });
        this.$set(this.$refs.formComponent.form, "effectRange", rangeDetailVos.join("、"));
        this.$set(this.$refs.formComponent.form, "judgeName", res.judgeName);
        this.$set(this.$refs.formComponent.form, "incidentOutline", res.incidentOutline);
        this.$set(this.$refs.formComponent.form, "warningLvName", res.warningLvName);
        this.$set(this.$refs.formComponent.form, "dangerName", res.dangerName);
        // this.$set(this.$refs.formComponent.form, "effectRange", res.effectRange);
        this.$set(this.$refs.formComponent.form, "warningNoticeName", res.warningNoticeName);
        this.$set(this.$refs.formComponent.form, "effectStartTime", res.effectStartTime);
        this.$set(this.$refs.formComponent.form, "effectEndTime", res.effectEndTime);
      });
    },
    // 详情
    detailList(id) {
      this.$router.push({
        name: "NoticeDetail",
        query: { id: id.id }
      });
    },
    // 选择器
    handleSelectionChange(val) {
      this.multipleSelection = val;
    },
    // 审批编辑处理
    ApproveEdit(id) {
      this.dialogConfig.isShow = true;
      this.Hdepartment();
      this.getInputVals();
      detailList({ id: id.id }).then(res => {
        this.createDeptName = res.createDeptName;
        this.createDeptId = res.createDeptId;
        this.creator = res.creator;
        this.createId = res.createId;
        this.judgeId = res.judgeId;
        this.fid = res.id;
        // this.deptId = res.deptId.split("、");
        // this.deptName = res.deptName.split("、");
        // this.unitName = res.unitName.split("、");
        // this.unitId = res.unitId.split("、");
        this.rangeInfo = res.rangeDetailVos;
        this.$refs.formComponent2.form = res;
        if (this.distinguish === 1) {
          this.$set(this.$refs.formComponent3.form, "approvalOpinion", "");
          this.$set(this.$refs.formComponent1.form, "unitName", `${res.unitName.split("、")}${res.deptName.split("、")}`);
          this.$set(this.$refs.formComponent1.form, "deptName", res.deptName.split("、"));
          this.$set(this.$refs.formComponent1.form, "unitId", res.unitId.split("、"));
          this.$set(this.$refs.formComponent1.form, "deptId", res.deptId.split("、"));
        } else if (this.distinguish === 0) {
          this.$set(this.$refs.formComponent1.form, "unitName", res.unitName.split("、"));
          this.$set(this.$refs.formComponent1.form, "unitId", res.unitId.split("、"));
          this.$set(this.$refs.formComponent1.form, "deptName", res.deptName.split("、"));
          this.$set(this.$refs.formComponent1.form, "deptId", res.deptId.split("、"));
        }
        this.$set(this.tableList, "tableData", res.warningMeasureDetailVos);
        this.$set(this.$refs.formComponent.form, "warningNoticeName", res.warningNoticeName);
        this.$set(this.$refs.formComponent1.form, "contact", res.contact);
        this.$set(this.$refs.formComponent1.form, "contactId", res.contactId.split(","));
        this.$set(this.$refs.formComponent1.form, "outTheNewspaper", res.outTheNewspaper);
        this.$set(this.$refs.formComponent1.form, "newspaperId", res.outTheNewspaper);
        this.$set(this.$refs.formComponent1.form, "sendDuplicate", res.sendDuplicate);
        this.$set(this.$refs.formComponent1.form, "sendDuplicateId", res.sendDuplicate);

        getIssueJudgeData({ id: res.judgeId }).then(data => {
          this.infoId = data.infoId;
          this.infoIds = data.infoIds;
          const rangeDetailVos = data.rangeDetailVos.map(item => {
            return item.effectRange;
          });
          this.$set(this.$refs.formComponent.form, "effectRange", rangeDetailVos.join("、"));
          this.$set(this.$refs.formComponent.form, "judgeName", data.judgeName);
          this.$set(this.$refs.formComponent.form, "incidentOutline", data.incidentOutline);
          if (res.warningLvName !== "" || res.warningLvName !== null) {
            this.$set(this.$refs.formComponent.form, "warningLvName", res.warningLvName);
          } else {
            this.$set(this.$refs.formComponent.form, "warningLvName", data.warningLvName);
          }
          this.$set(this.$refs.formComponent.form, "dangerName", data.dangerName);
          // this.$set(this.$refs.formComponent.form, "effectRange", res.effectRange);
          this.$set(this.$refs.formComponent.form, "effectStartTime", data.effectStartTime);
          this.$set(this.$refs.formComponent.form, "effectEndTime", data.effectEndTime);
        });
        if (this.distinguish === 1) {
          this.dialogConfig.btnList = [
            {
              name: "同意",
              id: "AgreeFrom", // 事件名
              type: "primary",
              size: "small"
            },
            {
              name: "驳回",
              id: "RejectFrom",
              size: "small"
            },
            {
              name: "取消",
              id: "Qxiao",
              size: "small"
            }
          ];
        } else if (this.distinguish === 0) {

          this.dialogConfig.btnList = [
            {
              name: "提交",
              id: "BSubmit", // 事件名
              type: "primary",
              size: "small"
            },
            {
              name: "保存",
              id: "submitForm",
              size: "small"
            },
            {
              name: "取消",
              id: "Qxiao",
              size: "small"
            }
          ];
        }
      });

    },
    // 编辑
    HanEdit(id) {
      this.type = 5;
      this.distinguish = 0;
      this.formConfig1.formData = [{
        type: "selectTree",
        label: "主送单位",
        prop: "unitName",
        name: "unitId",
        title: "主送单位选择",
        choose: false,
        isDisabled: false,
        multiple: true,
        keyWord: "keyWord",
        treeRef: "treeRef",
        commonClick: false,
        ref: "tree_select",
        class: "sjgy",
        lableWidth: "130px",
        option: [],
        treeData: {
          data: [],
          default: ["1"],
          checked: [],
          props: {
            children: "children",
            label: "orgName",
            value: "id"
          }
        }
      },
      // {
      //   type: "cascader",
      //   label: "预警部门",
      //   prop: "deptId",
      //   // name: "unitName",
      //   // dic: "unit",
      //   isDisabled: false,
      //   class: "sjgy",
      //   multiple: true,
      //   lableWidth: "130px",
      //   option: [],
      //   props: {
      //     label: "orgName",
      //     value: "id",
      //     checkStrictly: true,
      //     emitPath: false,
      //     multiple: true,
      //     expandTrigger: "hover"
      //   }
      // },
      {
        type: "select",
        label: "预警部门",
        prop: "deptId",
        name: "deptName",
        filterable: true,
        multiple: true,
        isDisabled: false,
        class: "sjgy",
        lableWidth: "130px",
        option: []
      },

      {
        type: "select",
        label: "联系人",
        prop: "contactId",
        name: "contact",
        filterable: true,
        multiple: true,
        isDisabled: false,
        class: "sjgy",
        lableWidth: "130px",
        option: []
      },
      {
        type: "input",
        label: "抄报",
        dic: "dic_cb",
        prop: "outTheNewspaper",
        name: "newspaperId",
        isDisabled: false,
        class: "half",
        multiple: true,
        lableWidth: "130px",
        option: []
      },
      {
        type: "input",
        label: "抄送",
        dic: "dic_cs",
        prop: "sendDuplicate",
        name: "sendDuplicateId",
        isDisabled: false,
        class: "half",
        multiple: true,
        lableWidth: "130px",
        option: []
      }
      ];
      this.getOrgTree();
      this.getOrgTrees();
      this.ApproveEdit(id);


    },
    // 审批
    ApprovalForm(id) {
      this.formConfig1.formData = [
        {
          type: "input",
          label: "主送单位及部门",
          prop: "unitName",
          name: "unitId",
          multiple: true,
          isDisabled: false,
          class: "sjgy",
          lableWidth: "130px",
          option: []
        },
        {
          type: "select",
          label: "联系人",
          prop: "contactId",
          filterable: true,
          name: "contact",
          multiple: true,
          isDisabled: false,
          class: "sjgy",
          lableWidth: "130px",
          option: []
        },
        {
          type: "input",
          label: "抄报",
          dic: "dic_cb",
          prop: "newspaperId",
          name: "outTheNewspaper",
          isDisabled: false,
          class: "half",
          multiple: true,
          lableWidth: "130px",
          option: []
        },
        {
          type: "input",
          label: "抄送",
          dic: "dic_cs",
          prop: "sendDuplicateId",
          name: "sendDuplicate",
          isDisabled: false,
          class: "half",
          multiple: true,
          lableWidth: "130px",
          option: []
        }
      ];
      this.distinguish = 1;
      this.titleConfig = [
        {
          title: "信息来源",
          name: "1",
          slot: "slot1"
        },
        {
          title: "措施要求",
          name: "2",
          slot: "slot2"
        },
        {
          title: "预警对象",
          name: "3",
          slot: "slot3"
        },
        {
          title: "填报信息",
          name: "4",
          slot: "slot4"
        },
        {
          title: "审批信息",
          name: "5",
          slot: "slot5"
        }
      ];
      this.$nextTick(() => {
        this.$refs.formComponent3.form = this.FilledBy;
      });
      this.ApproveEdit(id);
      this.getOrgTree();
      this.getOrgTrees();
      this.tableList.formLabel.prompt = false;
      this.tableList.columns = this.tableList.columns1;
      this.formConfig1.rules = {};
      this.formConfig.rules = {};
      this.formConfig.formData[0].isDisabled = true;
      this.formConfig1.formData[0].isDisabled = true;
      this.formConfig1.formData[1].isDisabled = true;
      this.formConfig1.formData[2].isDisabled = true;
      this.formConfig1.formData[3].isDisabled = true;
      // this.formConfig1.formData[4].isDisabled = true
      this.formConfig.formData[1].isDisabled = true;
    },
    // 同意
    async AgreeFrom() {
      this.type = 3;
      this.submitForm();
    },
    // 驳回
    RejectFrom() {
      this.type = 4;
      this.submitForm();
    },
    // 平铺树结构
    // flatTreeArr (arr) {
    //   return arr.reduce((acc, cur) => {
    //     if (Array.isArray(cur.children)) {
    //       const copyCur = { ...cur };
    //       delete copyCur.children;
    //       return acc.concat(copyCur, this.flatTreeArr(cur.children));
    //     } else {
    //       return acc.concat(cur);
    //     }
    //   }, []);
    // },
    // 列表删除
    detailForm(id) {
      this.$confirm("此操作将永久删除该条数据, 是否继续?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      }).then(() => {
        deleteById({
          id: id.id
        }).then(data => {
          if (data) {
            this.$message({
              message: "删除成功",
              type: "success"
            });
            this.list();
          }
        });
      }).catch(() => {
        this.$message({
          type: "info",
          message: "已取消删除"
        });
      });
    },
    // 分页
    handleSizeChange(val) {
      this.pageNum = val["current-page"];
      this.pageSize = val["page-size"];
      this.query();
    },
    BindVideo(row) {
      console.log(111111111111111);
      detailList({ id: row.id }).then(res => {
        console.log(res);
        this.$refs.videoForm.form = res;
      });
      this.bdVideoDialog.dialogConfig.isShow = true;
    },
    close1() {
      this.bdVideoDialog.dialogConfig.isShow = false;
    }
  }
};
</script>

<style scoped lang="less">
@import "../../../assets/style/common.less";
@import "../../../assets/style/ComponentStyle.less";
@import "../../../assets/style/pop-upNotification.less";

.EmergencyList {
  padding-bottom: 0 !important;

  :deep(.el-textarea__inner) {
    min-height: 20px !important;
  }
}

s :deep(.el-breadcrumb__inner.is-link) {
  font-weight: 100;
  color: #fff;
}

.EmergencyList :deep(.el-breadcrumb__item:last-child .el-breadcrumb__inner) {
  color: #3270ff;
}

:deep(.el-table--striped .el-table__body tr.el-table__row--striped.el-table__row--striped.el-table__row--striped td) {
  background-color: #f8f9f8;
  /*隔行变色*/
}

:deep(.el-tag__close) {
  background-color: rgba(185, 206, 250) !important;
  color: #333333 !important;
  border-radius: 0px !important;
  height: 25px;
  font-size: 15px !important;
  border: none !important;
}

:deep(.el-tag.el-tag--info) {
  background-color: rgba(185, 206, 250) !important;
  color: #333333 !important;
  border-radius: 0px !important;
  height: 25px;
  font-size: 15px !important;
  border: none !important;
}

:deep(.el-select .el-tag__close.el-icon-close) {
  background: none;
  font-size: 16px;
}

//鼠标悬浮样式
:deep(tr.hover-row) {

  &,
  &.el-table__row--striped {

    &,
    &.current-row {
      >td.el-table__cell {
        background: none;
      }
    }
  }
}

.box {
  // width: 100%;
  // height: 80vh;
  // padding: 0;
  // margin: 0;
  margin-top: 20px;
  background-color: #fff;
  border-radius: 4px;
  padding: 10px;
  box-sizing: border-box;
}

:deep(.el-cascader--small) {
  width: 100% !important;
}

:deep(.el-breadcrumb) {
  font-size: 16px;
  line-height: initial;
}

.videoDiv {
  justify-content: space-between;
  width: 100%;
  height: 420px;

  > :first-child {
    width: 56%;
  }

  .device {
    width: 43%;
    height: 100%;

    .deviceMain {
      width: 99%;
      height: 413px;
      border: 2px solid #3270ff;
      border-radius: 4px;
      overflow: hidden;
      background-color: rgba(213, 240, 255, 0.2);

      .deviceTitle {
        height: 31px;
        line-height: 31px;
        letter-spacing: 1px;
        font-size: 18px;
        font-weight: bold;
        padding-left: 15px;
        color: #d5f0ff;
        background-color: rgba(38, 92, 255, 0.45);
      }

      .deviceSearch {
        width: 93%;
        margin: 10px auto;

        :deep(.el-input__inner) {
          height: 35px;
          background-color: rgba(13, 38, 82, 0.58);
          border: 2px solid #008dff;
          color: #ccc;
        }
      }

      .videoTree {
        height: 330px;
        margin: 0 3.5%;
        overflow-y: auto;
      }

      :deep(.el-tree) {
        background: transparent;

        .el-tree-node:focus>.el-tree-node__content {
          background-color: transparent;
        }

        .el-tree-node__content:hover {
          background-color: transparent;
        }

        .el-tree-node__label {
          font-weight: bold;
          color: #008dff;
        }

        .el-tree-node__content {
          height: 42px;
          border-bottom: 1px solid #f2f2f2;
        }
      }
    }
  }
}
</style>
